<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>物料组成设计单变更</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="Content-Type" content="multipart/form-data; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../../../lib/layui-v2.5.5/css/layui.css" media="all">
    <link rel="stylesheet" href="../../../css/public.css" media="all">
</head>

<body>
    <div class="layuimini-container">
        <div class="layuimini-main">
            <!--搜索开始-->
            <fieldset class="layui-elem-field layuimini-search">
                <legend>搜索信息</legend>
                <div style="margin: 10px 10px 10px 10px">
                    <form class="layui-form layui-form-pane" action="" id="searchFrm">
                        <div class="layui-form-item">

                            <div class="layui-inline">
                                <label class="layui-form-label">产品名称</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="productName" id="productName" autocomplete="off"
                                        class="layui-input">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label" style="width: 150px;">开始时间</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="startTime" id="startTime" autocomplete="off"
                                        class="layui-input">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label" style="width: 150px;">结束时间</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="endTime" id="endTime" autocomplete="off"
                                        class="layui-input">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">审核状态</label>
                                <div class="layui-input-inline">
                                    <select name="checkTag" class="checkTagSel">
                                        <option value="" selected>请选择</option>
                                    </select>
                                </div>
                            </div>
                            <div class="layui-inline">
                                <a class="layui-btn " lay-submit="" lay-filter="data-search-btn"><label
                                        class="layui-icon layui-icon-search"></label>搜索</a>
                                <a class="layui-btn layui-btn-warm" onclick="javascript:$('#searchFrm')[0].reset()"
                                    lay-filter="data-search-btn"><label
                                        class="layui-icon layui-icon-refresh"></label>重置</a>
                            </div>
                        </div>
                    </form>
                </div>
            </fieldset>
            <!--搜索结束-->

            <!--表格开始-->
            <table class="layui-hide" id="productfileTable" lay-filter="productfileTable"></table>
            <div style="display: none;" type="text/html" id="productfileTableBar">
                <a class="layui-btn productfile_btn_show layui-btn-xs " lay-event="show">详情</a>
                <a class="layui-btn productfile_btn_update layui-btn-xs layui-btn-warm data-count-delete"
                    lay-event="update">组成修改</a>
                <a class="layui-btn productfile_btn_update layui-btn-xs layui-btn-danger data-count-delete"
                    lay-event="delete">删除</a>
            </div>

            <!--表格结束-->

            <!--详情的弹出层开始-->
            <div id="addOrUpdateDiv" style="display: none;padding: 20px;">
                <form method="post" class="layui-form layui-form-pane" lay-filter="dataFrm" id="dataFrm">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label" style="width: 150px;">设计编号</label>
                            <div class="layui-input-inline">
                                <!-- 做修改 -->
                                <input type="hidden" name="id" />
                                <input type="text" name="designId" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label" style="width: 150px;">产品编号：</label>
                            <div class="layui-input-inline">
                                <input type="text" name="productName" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label" style="width: 150px;">产品名称：</label>
                            <div class="layui-input-inline">
                                <input type="text" name="productName" lay-verify="required" autocomplete="off"
                                    class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-inline" id="firstKind_Name">
                            <label class="layui-form-label" style="width: 150px;">一级分类</label>
                            <div class="layui-input-inline">
                                <input type="text" name="firstKindName" id="firstKindName" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline" id="secondKind_Name">
                            <label class="layui-form-label" style="width: 150px;">二级分类</label>
                            <div class="layui-input-inline">
                                <input type="text" name="secondKindName" id="secondKindName" class="layui-input">
                            </div>

                        </div>
                        <div class="layui-inline" id="thirdKind_Name">
                            <label class="layui-form-label" style="width: 150px;">三级分类</label>
                            <div class="layui-input-inline">
                                <input type="text" name="thirdKindName" id="thirdKindName" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label" style="width: 150px;">设计人</label>
                            <div class="layui-input-inline">
                                <input type="text" name="designer" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label" style="width: 150px;">设计要求</label>
                            <div class="layui-input-inline">
                                <input type="text" name="moduleDescribe" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label" style="width: 150px;">物料总成本</label>
                            <div class="layui-input-inline">
                                <input type="text" name="costPriceSum" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label" style="width: 150px;">登记人</label>
                            <div class="layui-input-inline">
                                <input type="text" name="register" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label" style="width: 150px;">登记时间</label>
                            <div class="layui-input-inline">
                                <input type="text" name="registerTime" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                    </div>
            </div>
        </div>
        </form>
    </div>
    <!--详情的弹出层结束-->

    <!--设计物料组成开始-->
    <div id="addDiv" style="display: none;padding: 20px;">
        <form method="post" class="layui-form layui-form-pane" lay-filter="MaterialdataFrm" id="MaterialdataFrm">
            <table class="layui-table" id="productAddTable" lay-filter="productAddTable"></table>
            <div class="layui-inline">
                <label class="layui-form-label" style="width: 150px;">设计要求：</label>
                <div class="layui-input-inline" width="200px">
                    <input type="text" name="moduleDescribe" id="moduleDescribe" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label" style="width: 150px;">当前选中总计：</label>
                <div class="layui-input-inline" width="200px">
                    <input type="text" name="costPriceSum" id="costPriceSum" value="" autocomplete="off"
                        class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label" style="width: 150px;">产品名：</label>
                <div class="layui-input-inline" width="200px">
                    <input type="text" name="productName" autocomplete="off" class="layui-input" disabled="disabled">
                </div>
            </div>
        </form>
    </div>

    <!--设计物料组成结束-->
    <script src="../../../lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
    <script src="../../../lib/layui-v2.5.5/layui.js" charset="utf-8"></script>
    <script src="../../../js/lay-config.js?v=1.0.4" charset="utf-8"></script>
    <script src="../../../lib/jq-module/jquery.particleground.min.js" charset="utf-8"></script>
    <script src="../../../lib/common/jquery.cookie.min.js" charset="utf-8"></script>
    <script src="../../../lib/common/common.js" charset="utf-8"></script>

    <script>
        layui.use(['form', 'table', 'laydate', 'layer'], function () {
            var form = layui.form;
            var table = layui.table;
            var laydate = layui.laydate;
            var layer = layui.layer;


            laydate.render({
                elem: '#startTime',
                type: "datetime"
            });
            laydate.render({
                elem: '#endTime',
                type: "datetime"
            });


            //加载查询条件里面的审核下拉列表
            $.get(api5 + "dropdownbox/queryAllCheckTag", function (res) {
                var search_checkTag = $(".checkTagSel");
                var html = "<option value =''>请选择</option>";
                var data = res.data;
                $.each(data, function (index, item) {
                    html += "<option value =" + item.keyNumber + ">" + item.textDescribe + "</option>";
                });
                search_checkTag.html(html);
                form.render("select");
            });

            var tableIns = table.render({
                elem: '#productfileTable',
                url: api5 + 'ProductMaterial/queryAllProductMaterial',
                toolbar: "#productfileToolBar",
                height: 'full-165',
                cols: [[
                    { field: 'designId', title: '设计编号', align: "center", },
                    { field: 'productId', title: '产品编号', align: "center", },
                    { field: 'productName', title: '产品名称', align: "center", },
                    { field: 'register', title: '创建人', align: "center", },
                    { field: 'registerTime', title: '设计时间', align: "center", },
                    { field: 'costPriceSum', title: '物料价格', align: "center", },
                    { field: 'changeTag', title: '变更标志', align: "center", },
                    { title: '操作', templet: '#productfileTableBar', fixed: "right", align: "center", }
                ]],
                page: true,
                done: function (res, curr, count) {
                    $("#productfileTable").find("[data-field='changeTag']").css("display", "none");
                    //将变更标志转换为中文
                    $("[data-field='changeTag']").children().each(function () {
                        if ($(this).text() == 'B002-1') {
                            $(this).text("未变更")
                        } else if ($(this).text() == 'B002-2') {
                            $(this).text("已变更")
                        }
                    });


                }
            });

            // 监听搜索操作
            form.on('submit(data-search-btn)', function (data) {
                var params = $("#searchFrm").serialize();
                //执行搜索重载
                table.reload('productfileTable', {
                    page: {
                        curr: 1
                    },
                    url: api5 + 'ProductMaterial/queryAllProductMaterial?' + params
                });
                return false;
            });

            //监听行数据的事件
            table.on('tool(productfileTable)', function (obj) {
                var data = obj.data;
                if (obj.event === 'update') {
                    addproductFile(data);
                } else if (obj.event === 'show') {
                    showproductfile(data);
                } else if (obj.event === 'delete') {
                    layer.prompt({
                        formType: 1,
                        value: '',
                        maxlength: 6, //可输入文本的最大长度，默认500
                        title: '敏感操作，请输入口令'
                    }, function (value, index, elem) {
                        if (value == 'yby123') {
                            $.post(api5 + "productfile/deleteProductAll", {
                                id: data.id
                            }, function (res) {
                                layer.msg(res.msg);
                                obj.del();
                                layer.close(index);
                            })
                        } else {
                            layer.msg("口令错误");
                        }
                    });
                }
            });

            //详情窗口
            function showproductfile(data) {
                mainIndex = layer.open({
                    type: 1,
                    title: '查看[' + data.productName + ']产品档案',
                    url: '',
                    content: $("#addOrUpdateDiv"),
                    area: ['1150px', '400px'],
                    success: function (index) {
                        //装载数据表格
                        console.log(data);
                        form.val("dataFrm", data);
                    }
                });
            }

            let dataVal;
            let all = 0;
            var listData = []

            //产品物料设计
            function addproductFile(data) {
                var EdittableIns;
                mainIndex = layer.open({
                    type: 1,
                    title: '产品物料设计',
                    content: $("#addDiv"),
                    area: ['1150px', '580px'],
                    btn: ['<span class="layui-icon layui-icon-ok">保存</span>'],
                    yes: function (indexs, layero) {
                        layer.load(0, {
                            time: 1500
                        });

                        var checkStatus = table.checkStatus('productAddTable');
                        var checkData = checkStatus.data;
                        var allTotal = 0;
                        let costPriceSum = 0;

                        $.each(dataVal.data, function (index, item) {
                            item.subtotal = (item.amount * item.costPrice);
                            console.log(item.productDescribe)

                            allTotal += item.subtotal;
                        });
                        data.moduleDescribe = $("#moduleDescribe").val();
                        data.costPriceSum = allTotal;
                        // layer.alert(JSON.stringify(checkData));
                        console.log(data);
                        console.log(checkData);
                        console.log(dataVal.data);
                        checkData.push(data);
                        dataVal.data.push(data);
                        $.ajax({
                            url: api5 + "productfile/updProductFileAll",
                            type: 'POST',
                            data: JSON.stringify(dataVal.data),
                            dataType: 'json',
                            contentType: 'application/json;charset=utf-8',
                            success: function (res) {
                                layer.msg(res.msg);
                                layer.close(index);
                                console.log(data);
                            },
                            error: function (data) {
                                console.log(ret.status);
                                console.log(data.status);
                            }
                        });
                    },
                    success: function (index) {
                        form.val("MaterialdataFrm", {
                            productName: data.productName,
                            costPriceSum: null,
                        });
                        //类型物料表
                        EdittableIns = table.render({
                            elem: '#productAddTable',
                            url: api5 + 'ProductMaterialDetails/getProductMaterialDetailsBy?parentId=' + data.id,
                            cellMinWidth: 150,
                            cols: [
                                [
                                    {
                                        field: 'productId',
                                        title: '编号',
                                        align: "center"
                                    },
                                    {
                                        field: 'productName',
                                        title: '产品名称',
                                        align: "center"
                                    },
                                    {
                                        field: 'costPrice',
                                        title: '成本单价',
                                        align: "center"
                                    },
                                    {
                                        field: 'amount',
                                        title: '数量',
                                        align: "center",
                                        edit: 'amount'
                                    },
                                    {
                                        field: 'subtotal',
                                        title: '小计',
                                        align: "center"
                                    },
                                    {
                                        field: 'productDescribe',
                                        title: '描述',
                                        align: "center",
                                        edit: 'describe'
                                    }
                                ]
                            ],
                            done: function (res, curr, count) {
                                dataVal = res;
                                for (var i = 0; i < res.data.length; i++) {
                                    all += parseInt(res.data[i].subtotal);
                                }
                                form.val("MaterialdataFrm", { costPriceSum: all, moduleDescribe: data.moduleDescribe });
                                all = 0;
                            },

                        });
                    }
                });
            }


            table.on('edit(productAddTable)', function (obj) {
                var value = obj.value //得到修改后的值
                    , data = obj.data //得到所在行所有键值
                    , field = obj.field; //得到字段
                console.log(obj);
                console.log(obj.tr[0].childNodes[4].childNodes[0].innerHTML = (obj.data.amount * obj.data.costPrice));
                $.each(dataVal.data, function (index, item) {
                    all += parseInt(item.amount) * parseInt(item.costPrice);
                });
                form.val("MaterialdataFrm", { costPriceSum: all });
                all = 0;
            });



            //提交数据
            form.on("submit(doSubmit)", function (data) {
                var btn = $(this);
                btn.text("提 交 中...").attr("disabled", "disabled").addClass("layui-disabled");
                var params = $("#dataFrm").serialize();
                console.log(params);
                alert(params)
                $.post(url, params, function (res) {
                    layer.msg(res.msg);
                    if (res.code == 200) {
                        btn.text("提交").attr("disabled", "").removeClass("layui-disabled");
                        tableIns.reload();
                    }
                    layer.close(mainIndex);
                })
                return false;
            })

            //批量审核通过
            function batchCheckTagYes() {
                var checkStatus = table.checkStatus('productfileTable'); //idTest 即为基础参数 id 对应的值
                var data = checkStatus.data;
                var length = checkStatus.data.length;
                console.log(checkStatus.data) //获取选中行的数据
                console.log(checkStatus.data.length) //获取选中行数量，可作为是否有选中行的条件
                if (length == 0) {
                    layer.msg("请选中要审核的行数据");
                } else {
                    var params = "";
                    $.each(data, function (index, item) {
                        if (index == 0) {
                            params += "ids=" + item.id;
                        } else {
                            params += "&ids=" + item.id;
                        }
                    });
                    $.post(api5 + "ProductMaterial/updateCheckYesProductMaterial", params, function (res) {
                        layer.msg(res.msg);
                        tableIns.reload();
                        layer.close(index);
                    });
                }
            }

            //批量审核不通过
            function batchCheckTagNo() {
                var checkStatus = table.checkStatus('productfileTable'); //idTest 即为基础参数 id 对应的值
                var data = checkStatus.data;
                var length = checkStatus.data.length;
                console.log(checkStatus.data) //获取选中行的数据
                console.log(checkStatus.data.length) //获取选中行数量，可作为是否有选中行的条件
                if (length == 0) {
                    layer.msg("请选中要审核的行数据");
                } else {
                    var params = "";
                    $.each(data, function (index, item) {
                        if (index == 0) {
                            params += "ids=" + item.id;
                        } else {
                            params += "&ids=" + item.id;
                        }
                    });
                    $.post(api5 + "ProductMaterial/updateCheckNoProductMaterial", params, function (res) {
                        layer.msg(res.msg);
                        tableIns.reload();
                        layer.close(index);
                    });

                }
            }
        });
    </script>
</body>

</html>